﻿@page
@model Emprise.Web.Pages.User.ForgotPasswordModel
@{
    ViewData["Title"] = "忘记密码";
    Layout = "_Layout";
}


<div class="big_bg" id="app">
    <div class="nav">
        <h2 class="nav-title">忘记密码</h2>
        <a href="@(Url.Page("/User/Login"))" class="nav-back"><span><<返回</span></a>
    </div>

    <div class="main">
        <div>
            <template v-if="!hasSend">
                <div class="login-nonreg">
                    <form>
                        <div class="form-text-login">
                            <label>邮箱：</label>
                            <input type="text" class="form-text" v-model="email" />
                            <a href="javascript:;" class="form-text-clear fn-hide"><i class="icon icon-clear"></i></a>
                        </div>
                    </form>

                </div>
                <div class="fn-mt-login fn-mlr" v-cloak>
                    <a class="btn btn-bar-tawny" href="javascript:;" @@click="reset"> 确 定 </a>
                </div>
                <div class="fn-mt-login fn-mlr" style="text-align:right;">
                    <a style="font-size:12px;" href="@(Url.Page("/User/Login"))">已有账号，直接登录</a>
                </div>
            </template>

            <div class="fn-mt-login fn-mlr" v-else>
                <div>
                    <p>已发送邮件到 <span>{{emailToLower}}</span>，请登录邮箱查看。</p>
                    <p>重设密码成功后，点击下面按钮</p>
                </div>

                <a class="btn btn-bar-tawny mt15" href="@(Url.Page("/User/Login"))"> 登录游戏 </a>
            </div>

            <div class="fn-mt fn-mlr"><span class="tip01 tips">{{tips}}</span></div>
        </div>

    </div>


</div>
@await Html.PartialAsync("_Footer", Model.SiteConfig)
@section Scripts {
    <script type="text/javascript">
        var vm = new Vue({
            el: '#app',
            data: {
                email: "",
                tips: "",
                hasSend: false,
                loading: 0,
            },
            computed: {
                resetUrl: function () {
                    return "/user/resetpassword?email=" + this.emailToLower;
                },
                emailToLower: function () {
                    return this.email.toLowerCase();
                }
            },
            methods: {
                reset: function () {
                    var that = this;
                    that.tips = "";

                    if (!that.email) {
                        that.tips = "请输入邮箱" + that.email;
                        return false;
                    }

                    that.loading = 1;

                    axios.post("", {
                        email: that.email
                    }, {
                        headers: {
                            RequestVerificationToken: document.getElementsByName("__RequestVerificationToken")[0].value
                        }
                    })
                        .then(function (response) {
                            var result = response.data;
                            if (result.status) {
                                //that.hasSend = true;
                                location.replace(that.resetUrl);
                            } else {
                                var error = result.errorMessage || "登录失败";
                                if (result.data) {
                                    error += "<br>" + result.data;
                                }
                                that.tips = error;
                            }
                            that.loading = 0;
                        })
                        .catch(function (error) {
                            console.log(error);
                            that.loading = 0;
                        });
                }
            }
        });

    </script>
}

